/**
 * 普通弹框
 * 调用方法：
 */

import * as React from 'react';
import { View, Text, TextStyle } from 'react-native';

import Button from '../Button';
import styles from './style';

interface Alert {
  title?: string;
  subTitle?: string;
  cancelAction?: () => void;
  sureAction: () => void;
  cancelDesc?: string;
  sureDesc?: string;
  cancelDescStyle?: TextStyle;
  sureDescStyle?: TextStyle;
  children?: React.ReactElement;
  sureDisabled?: boolean;
}

const PortraitAlert = (props: Alert): React.ReactElement => {
  const {
    title = '',
    subTitle = '',
    cancelAction = null,
    sureAction = (): boolean => true,
    cancelDesc = '取消',
    sureDesc = '确定',
    children,
    sureDisabled = false
  } = props;

  return (
    <View style={styles.container}>
      {!subTitle && !children && <View style={styles.topEmpty} />}
      <Text style={styles.title} numberOfLines={1}>
        {title}
      </Text>
      {!subTitle && !children ? (
        <View style={styles.bottomEmpty} />
      ) : (
        <View style={styles.subTitleContent}>
          {children || <Text style={styles.subTitle}>{subTitle}</Text>}
        </View>
      )}

      <View style={[styles.loadButton, cancelAction ? {} : styles.bigContent]}>
        {cancelAction && (
          <Button
            style={[styles.button, styles.cannelButton]}
            activity
            textStyle={[styles.buttonDesc, styles.cannelButtonDesc]}
            text={cancelDesc}
            onPress={cancelAction}
          />
        )}
        <Button
          style={[
            styles.button,
            styles.sureButton,
            cancelAction ? {} : styles.big
          ]}
          activity={!sureDisabled}
          textStyle={[styles.buttonDesc, styles.sureButtonDesc]}
          text={sureDesc}
          onPress={sureAction}
        />
      </View>
    </View>
  );
};

export default PortraitAlert;
